import { MyHead } from "../../../components/head"
import { Tabs } from "antd-mobile"
import {useState,useEffect} from 'react'
import { getMs } from "../../../api/AddMs"
import { useSelector } from "react-redux"
import { RootReducer } from "../../../types/store"
import { useTiaoZhuan } from "../../../hooks/routers"
import MyList from "../../../components/myList"
import { useLocalStorageState } from "ahooks"
const WdMs = ()=>{
    const [activeKey,setActiveKey] = useState('has')
    const [data,setData] = useState<addmsType[]>([])
    const {Tz} = useTiaoZhuan()
    const userData = useSelector<RootReducer,foundUserType | null>(state=>state.MyData.userData)
    const fromPath = useLocalStorageState<string|undefined>(
        'frompath'
    )
    const getData=  async()=>{
        if(!userData){
            Tz('/login')
            return
        }

        let res = await getMs(userData.phone)
        
        setData([...data,...res.result])

    }
    useEffect(()=>{
        getData()
        console.log(fromPath);
        
        
    },[])
    return(
        <div>
            <MyHead title='我的面试' router={fromPath[0] =='/addms'?'/homes/my':undefined}/>
            <Tabs activeKey={activeKey} onChange={setActiveKey} style={{paddingTop:50}}>
                <Tabs.Tab title='带录音' key='has'>
                    <MyList list={data.filter((item)=>item.audioSrc)}  hasAudio={true}  ></MyList>
                </Tabs.Tab> 
                <Tabs.Tab title='无录音' key='hasno'>
                    <MyList list={data.filter((item)=>item.audioSrc=='')} ></MyList>
                </Tabs.Tab>
            </Tabs>
        </div>
    )
}

export default WdMs